<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:pe="http://primefaces.org/ui/extensions"
	xmlns:fc="http://fctracker.com/facelets"
	xmlns:p="http://primefaces.org/ui">

<h:head>
</h:head>

<h:body>
	<h1>Mérés napló</h1>
	<h:form id="measurementJournalForm">
		<p:selectOneMenu id="typeInput"
			value="#{measurementController.measurementType}">
			<p:ajax event="change" update=":chart dataTable"
				listener="#{measurementController.refreshChart()}" />
			<f:converter binding="#{measurementTypeConverter}" />
			<f:selectItems value="#{measurementController.findAll()}" />
		</p:selectOneMenu>

		<p:dataTable id="dataTable" var="entry" style="margin-top: 10px"
			value="#{measurementController.entries}" rows="10"
			widgetVar="measurementTable"
			emptyMessage="Az adott hónapban még nincs mérés">
			<p:column id="timeColumn" headerText="Nap">
				<h:outputText value="#{entry.date}">
					<f:convertDateTime pattern="yyyy.MM.dd HH:mm" />
				</h:outputText>
			</p:column>

			<p:column id="valueColumn" headerText="Érték">
				<h:outputText
					value="#{entry.value} #{entry.measurementType.unitOfMeasurementString}" />
			</p:column>
			<f:facet name="footer">
				<p:commandButton value="" styleClass="addButton"
					id="addMeasurementButton" immediate="true" onerror="alert('error')"
					action="#{addMeasurementDialog.show()}">
					<p:ajax event="dialogReturn" update=":chart"
						listener="#{measurementController.refreshChart()}" />
					<p:ajax event="dialogReturn"
						update=":measurementJournalForm:dataTable :chart" />
				</p:commandButton>
			</f:facet>
		</p:dataTable>




	</h:form>
	<p:lineChart id="chart" value="#{measurementController.chartModel}"
		animate="true" zoom="true"
		title="#{measurementController.measurementType.name}"
		showMarkers="true" min="#{measurementController.measurementType.min}"
		max="#{measurementController.measurementType.max}" />
</h:body>
</html>